<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link type="text/css" rel="stylesheet" href="css/style.css" />
</head>
<body>
<div id="app">
	<common>
		<div id="vote" class="wrap">
			<h2>查看投票</h2>
			<ul class="list">
				<li>
					<h4>{{vote.vname}}</h4>
					<p class="info">共有 {{vote.icnt}} 个选项，已有 {{vote.ucnt}} 个网友参与了投票。</p>
					<ol>
						<li v-for=" i in vote.items">{{i.iname}}
							<div class="rate">
								<div class="ratebg"><div class="percent" :style="{width:i.rate}"></div></div>
								<p>{{i.cnt}}票<span>({{i.rate}})</span></p>
							</div>
						</li>
					</ol>
					<div class="goback"><a href="manage.html">返回投票列表</a></div>
				</li>
			</ul>
		</div>
	</common>
</div>
<script src="js/vue.min.js"></script>
<script src="js/vote.js"></script>
<script src="js/axios.min.js"></script>
<script>
	var v =new Vue({
		el:"#app",
		data:{
			vote:{}
		},
		created(){
			axios.get("demovote/vote/find" + location.search).then(res=>{
				this.vote = res.data;
				let sum = 0;
				this.vote.items.forEach(item=>{
					sum += item.cnt;
				})
				this.vote.items.forEach(item=>{
					item.rate = parseInt(item.cnt * 100 / sum) + "%";
				})
			})
		},
	})
</script>

</body>
</html>
